<template>
	<view>
		<view class="formlist inputtext">
			<view class="formgroup border-bottom-E3E3E5">
				<view class="labletitle" v-if="showLabel" style="line-height: 65rpx;">
					<label>{{label}}</label>
					<text class="required" v-show="required">*</text>
				</view>
				<view class="controlvalue">
					<uni-rate :is-fill="false" :allowHalf='allowHalf' :margin="20" v-model="valueTitle" :max="max" @change="onChangeRate" :touchable="false" :disabled='disabled' :readonly='readonly'></uni-rate>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			value:0,
			showLabel:{
				type:Boolean,
				default(){
					return true
				}
			},
			max:{
				type:Number,
				default(){
					return 5
				}
			},
			required:{
				type:Boolean,
				default(){
					return false
				}
			},
			disabled:{
				type:Boolean,
				default(){
					return false
				}
			},
			label:{
				type:String,
				default(){
					return '评分'
				}
			},
			allowHalf:{
				type:Boolean,
				default(){
					return true
				}
			},
			readonly:{
				type:Boolean,
				default(){
					return false
				}
			}
		},
		data() {
			return {
				valueTitle:''
			};
		},
		created() {
			this.valueTitle = this.value
		},
		watch:{
			value(val){
				
				this.valueTitle = val
			}
		},
		methods:{
			/* 评分 */
			onChangeRate(e) {
				this.valueTitle = JSON.stringify(e.value)
				this.$emit('input',this.valueTitle)
				// this.$set(this.formData, "" + vModel + "", JSON.stringify(e.value))
				
			},
		}
	}
</script>

<style>
	.required{
		color: red;
	}
</style>
